<template>
  <div class="app-container">
    <!-- 第一行 -->
    <el-row :gutter="20">
      <!-- 年报精细化管理 (2/3宽度) -->
      <el-col :span="16">
        <AnnualManage />
      </el-col>

      <!-- 企业年报进度 (1/3宽度) -->
      <el-col :span="8">
        <EnterpriseAnnualProgress />
      </el-col>
    </el-row>

    <!-- 第二行 -->
    <el-row :gutter="20" style="margin-top: 20px;">
      <!-- 各县区企业年报情况跟踪 (2/3宽度) -->
      <el-col :span="16">
        <CountyEnterpriseTracking />
      </el-col>

      <!-- 各行业企业年报报送情况分布 (1/3宽度) -->
      <el-col :span="8">
        <IndustryDistribution />
      </el-col>
    </el-row>
  </div>
</template>

<script setup>
  import AnnualManage from './AnnualManage.vue'
  import EnterpriseAnnualProgress from './EnterpriseAnnualProgress.vue'
  import CountyEnterpriseTracking from './CountyEnterpriseTracking.vue'
  import IndustryDistribution from './IndustryDistribution.vue'
</script>

<style scoped>
  .app-container {
    padding: 20px;
  }
</style>